<template>
  <div>
    <!-- 头部 -->
    <header>
      <div class="top">
        <p>编辑地址</p>
      </div>
    </header>

    <!-- 地址编辑 -->
    <van-address-edit
      :area-list="areaList"
      show-postal
      show-delete
      show-set-default
      show-detail
      :area-columns-placeholder="['请选择', '请选择', '请选择']"
      @save="onSave"
      @delete="onDelete"
    />
  </div>
</template>
<script>
import { mapGetters, mapActions } from "vuex";
import { areaList } from "@vant/area-data";
import {Toast} from 'vant'
export default {
  props: [],
  components: {},
  data() {
    return {
      areaList,
      form:{
        username: "",
        userphone: "",
        useraddress: "",
        location: "",
        label:"",
        status:1
      }
    };
  },
  computed: {
    ...mapGetters({}),
  },
  methods: {
    ...mapActions({}),
     onSave(content) {
      Toast('save');
      console.log(content)
    //   this.form.username = content.name
    //this.form.userphone = content.tel
    //this.form.location=content.province+content.county+content.city
    //this.form.useraddress = content.addressDetail
    //this.form.label = 

    },
    onDelete() {
      Toast('delete');
    }
  },
  mounted() {},
};
</script>
<style scoped>
header {
  background: #ff6040;
  height: 1.45rem;
}
header .top {
  height: 0.8rem;
  display: flex;
  color: #ffdfd8;
  align-items: center;
  padding: 0.3rem 0.12rem 0.12rem 0.33rem;
  box-sizing: border-box;
}
header .top p {
  font-size: 0.5rem;
  margin: 0.5rem 1.45rem 0 2.2rem;
}
</style>